﻿@model EstimateShippingModel
@using IT.CMS.Web.Models.ShoppingCart;
@if (Model.Enabled)
{
    <div class="shipping">
        <script type="text/javascript">
            $(function () {
                $("#@Html.FieldIdFor(model => model.CountryId)").change(function () {
                    var selectedItem = $(this).val();
                    var ddlStates = $("#@Html.FieldIdFor(model => model.StateProvinceId)");
                    var estimateProgress = $("#estimate-shipping-loading-progress");
                    estimateProgress.show();
                    $.ajax({
                        cache: false,
                        type: "GET",
                        url: "@(Url.RouteUrl("GetStatesByCountryId"))",
                 data: { "countryId": selectedItem, "addEmptyStateIfRequired": "true" },
                 success: function (data) {
                     ddlStates.html('');
                     $.each(data, function (id, option) {
                         ddlStates.append($('<option></option>').val(option.id).html(option.name));
                     });
                     estimateProgress.hide();
                 },
                 error: function (xhr, ajaxOptions, thrownError) {
                     alert('Failed to retrieve states.');
                     estimateProgress.hide();
                 }
             });
                });
            });
        </script>

        <div class="estimate-shipping">
            <div class="title">
                <strong>@T("ShoppingCart.EstimateShipping")</strong>
            </div>
            <div class="hint">@T("ShoppingCart.EstimateShipping.Tooltip")</div>
            <div class="shipping-options">
                <div class="inputs">
                    @Html.LabelFor(model => model.CountryId, new { }, ":")
                @Html.DropDownListFor(model => model.CountryId, Model.AvailableCountries, new { @class = "country-input" })
                    @Html.ValidationMessageFor(model => model.CountryId)

                </div>
                <div class="inputs">
                    @Html.LabelFor(model => model.StateProvinceId, new { }, ":")
                @Html.DropDownListFor(model => model.StateProvinceId, Model.AvailableStates, new { @class = "state-input" })
                    <span id="estimate-shipping-loading-progress" style="display: none;" class="please-wait">@T("Common.Wait...")"</span>
                    @Html.ValidationMessageFor(model => model.StateProvinceId)

                </div>
                <div class="inputs">
                    @Html.LabelFor(model => model.ZipPostalCode, new { }, ":")
                @Html.TextBoxFor(model => model.ZipPostalCode, new { @class = "zip-input" })
                    @Html.ValidationMessageFor(model => model.ZipPostalCode)

                </div>
                <div class="inputs">
                    <input type="submit" name="estimateshipping" value="@T("ShoppingCart.EstimateShipping.Button")" class="button-2 estimate-shipping-button" />
                </div>
            </div>
            <div class="clear">
            </div>
            @if (Model.ShippingOptions.Count > 0)
            {
                <ul class="shipping-results">
                    @foreach (var shippingOption in Model.ShippingOptions)
                    {
                        <li class="shipping-option-item">
                            <strong class="option-name">
                                @shippingOption.Name (@shippingOption.Price)
                            </strong>
                            <span class="option-description">
                                @Html.Raw(shippingOption.Description)
                            </span>
                        </li>
                    }
                </ul>
                <div class="clear">
                </div>
            }
            @if (Model.Warnings.Count > 0)
            {
                <div class="message-error">
                    <ul>
                        @foreach (var error in Model.Warnings)
                        {
                            <li>@error</li>
                        }
                    </ul>
                </div>
            }
        </div>
    </div>
}